﻿@model USERS.CYT369.COM.Models.AccountView.LoginViewModel
@{
    ViewBag.Title = "用户登录";
    ViewBag.HeaderName = "欢迎登录";
    Layout = "_RegisterLoginLayout2";
    var qqCallback = USERS.CYT369.COM.UTILITY.SystemSettingService.Instance.QQCallback;
}

@section scripts{
    <script src="/lib/qc_jssdk.js" charset="utf-8"
            data-callback="true"
            data-appid="102004089"
            data-redirecturi="@qqCallback"></script>
    <script type="text/javascript">
        function RefreshCaptchaCode(img) {
            $(img).attr("src", "@Url.Content("~/Account/GetCaptcha")?p=" + new Date().getTime());
        }
        function OnTextKeyDown(e) {
            if (event.keyCode == 13) {
                DoLogin();
            }
        }

        function DoLogin() {
            var user = {
                UserName: $("#UserName").val().trim(),
                Password: $("#Password").val().trim(),
                CaptchaCode: $("#CaptchaCode").val().trim(),
                ReturnUrl: $("#ReturnUrl").val().trim(),
                ResultUrl: $("#ResultUrl").val().trim(),
                AppID: $("#AppID").val().trim(),
                RememberMe: $("#remeberMeChk")[0].checked,
            };
            if (user.UserName.length < 1) {
                $("#error_msg").text("登录用户名不能为空!");
                $(".err-msg").show();
                return;
            }
            if (user.Password.length < 1) {
                $("#error_msg").text("密码不能为空!");
                $(".err-msg").show();
                return;
            }

            if (user.CaptchaCode < 1) {
                $("#error_msg").text("验证码不能为空!");
                $(".err-msg").show();
                return;
            }

            $("#submit").attr('disabled', 'disabled');
            $("#submit").addClass("submit-btn-disable");

            $.ajax({
                url: '@Url.Content("~/Account/Login")',
                type: "POST",
                dataType: "JSON",
                contentType: "application/json;charset=utf-8",
                data: JSON.stringify(user),
                success: function (e, s, xhr) {
                    if (e.Result) {
                        var s = xhr.getResponseHeader("Set-Cookie");
                        location.href = e.Msg;
                    } else {
                        $("#error_msg").text(e.Msg);
                        $(".err-msg").show();

                        $("#submit").removeAttr('disabled');
                        $("#submit").removeClass("submit-btn-disable");
                    }
                },
                error: function () {
                    $("#submit").removeAttr('disabled');
                    $("#submit").removeClass("submit-btn-disable");
                }
            });
        }
    </script>

    <script type="text/javascript">
        function qq_login() {
            var opts = {
                appId: "102004089",
                redirectURI: "@qqCallback"
            };
            QC.Login.showPopup(opts);
        }
    </script>
}

<div class="form-panel">
    <div class="panel-top">
        <span>返回首页</span>
        <a class="a" href="~/Account/Register?appid=@ViewBag.AppID&returnUrl=@ViewBag.ReturnUrl&resultUrl=@ViewBag.ResultUrl">没有账号？去注册</a>
    </div>
    <div class="login-form">
        <div class="logo-icon">
            <img src="~/css/images/logo2.png" />
        </div>
        <ul class="login-type">
            <li class="t-item t-item2">账号密码登录</li>
            <li class="t-item">手机动态码登录</li>
        </ul>
        <div class="form">
            <div class="err-msg"><i class="fa fa-info-circle"></i><span id="error_msg"></span></div>
            <form method="post" action="~/Account/Login" autocomplete="off">
                <div class="row">
                    <input class="input iphone-input" id="UserName" name="UserName" type="text" placeholder="手机号" maxlength="11" autocomplete="off" />
                    <div class="input-icon icon-username"></div>
                </div>
                <div class="row">
                    <input class="input" id="Password" name="Password" type="password" placeholder="密码" autocomplete="off" maxlength="16" />
                    <div class="input-icon icon-password"></div>
                </div>
                <div class="row">
                    <input class="input" id="CaptchaCode" name="CaptchaCode" type="text" placeholder="输入6位验证码" autocomplete="off" maxlength="6" style="width:125px" onkeypress="OnTextKeyDown(this)" />
                    <div class="input-icon icon-captcha"></div>
                    <img class="captcha-img" src="~/Account/GetCaptcha" onclick="RefreshCaptchaCode(this)" />
                </div>
                <div class="row" style="margin-top:10px;padding-right:20px;">
                    <div class="remember-info">
                        <span><input id="remeberMeChk" type="checkbox" value="1" /><label for="remeberMeChk">两周内自动登录</label></span>
                        <span>
                            <a href="~/Account/ForgotPassword">忘记密码</a>
                        </span>
                    </div>
                    <input name="ReturnUrl" id="ReturnUrl" type="hidden" value="@ViewBag.ReturnUrl" />
                    <input name="ResultUrl" id="ResultUrl" type="hidden" value="@ViewBag.ResultUrl" />
                    <input name="AppID" id="AppID" type="hidden" value="@ViewBag.AppID" />
                    <input name="submit" id="submit" class="submit-btn" type="button" onclick="DoLogin()" value="登 录" />
                </div>
            </form>
        </div>
        <div class="login-others">
            <div class="login-icon" onclick="qq_login()">
                @*<div class="icon qq"></div>*@
                <img src="~/css/images/qq.png" class="icon qq" />
                <div class="name">QQ登录</div>
            </div>
            <div class="login-icon">
                <div class="icon wechat"></div>
                <div class="name">微信登录</div>
            </div>
        </div>
    </div>
    <div class="panel-bottom">
        <span>cyt369.com</span>
        <span>联系客服</span>
        <span>帮助</span>
    </div>
</div>